<template>
  <div id="app">
    <myNav :father-component='navMsg'></myNav>
      <div id="content">
        <keep-alive>
          <router-view></router-view>
        </keep-alive>
      </div>
    <myBot :father-component='tabMsg'></myBot>
  </div>
</template>

<script>
import "../static/rem";
import myNav from "./components/Nav";
import myBot from "./components/Tab";

export default {
  name: "app",
  data() {
    return {
      navMsg: "i am navMsg",
      tabMsg: "i am tabMsg",
    };
  },
  components: {
    myNav,
    myBot
  },
  watch: {
    $route(to, from) {
      if (/detail/.test(to.path)) {
        window.sessionStorage.setItem("isShow", 1);
        this.$store.dispatch("showORhide", 1);
      } else {
        window.sessionStorage.setItem("isShow", 0);
        this.$store.dispatch("showORhide", 0);
      }
    }
  },
  methods:{
    
  },
  mounted() {
    var self = this;
    setTimeout(function() {
      self.navMsg = "change navMsg";
      self.tabMsg = "change tabMsg";
    }, 2000);
  }
};
</script>

<style>
@import url("../static/resetCSS.css");
@import  url("../static/comCSS.css");
html,
body,
#app {
  font-size: 0.12rem;
  position: relative;
}
#content {
  margin-top: 0.5rem;
  padding-bottom: 1rem;
}
</style>
